<template>
	<view class="content">
		<view class="QR">
			<image :src="`http://59.110.166.212:8006/api/common/qrcode?${data}`" mode="" class="QrCode"></image>
		</view>
		<view class="title">让利幅度：{{txt}}</view>
		<view class="bottom">
			<picker mode="selector" :value="value" :range="rangli" range-key="text" @change="bindDateChange">
				<view class="" @click="checkRl">修改让利幅度</view>
			</picker>
	
			<view class="" @click="saveImg">保存图片</view>
		</view>
	</view>
</template>

<script setup>
	import { utils } from '@/utils/utils.js';
	import { onLoad, onShow } from '@dcloudio/uni-app';
	import { ref, onMounted } from 'vue';
const value = ref(0)
const txt = ref("")
const shopId = ref("")
const data = ref("")
const rangli = ref([
	{
		text:"3%",
		value:3
	},
	{
		text:"5%",
		value:5
	},
	{
		text:"10%",
		value:10
	},
	{
		text:"15%",
		value:15
	},
	{
		text:"20%",
		value:20
	},
])
onLoad((e)=>{
	console.log(e)
	shopId.value = e.code
	value.value = 3
	txt.value = '3%'
	data.value = `scene=${shopId.value},${value.value}&page=pages/sub/paySHopQR`
});
const bindDateChange = (e)=>{
	console.log(e)
	value.value = rangli.value[Number(e.detail.value)].value
	txt.value =  rangli.value[Number(e.detail.value)].text
	data.value = `scene=${shopId.value},${value.value}&page=pages/sub/paySHopQR`
};
const saveImg = () =>{
	uni.downloadFile({
	  url: `http://59.110.166.212:8006/api/common/qrcode?${data.value}`, // 图片的URL或Base64编码
	  success: (downloadResult) => {
	    if (downloadResult.statusCode === 200) {
			console.log(downloadResult)
	      uni.saveImageToPhotosAlbum({
	        filePath: downloadResult.tempFilePath, // 下载的图片临时路径
	        success: (res) => {
	          console.log('保存成功', res.savedFilePath); // 保存后的文件路径
	          uni.showToast({ title: '保存成功', icon: 'success' });
	        },
	        fail: (res) => {
				console.log(res)
	          uni.showToast({ title: '保存失败', icon: 'none' });
	        }
	      });
	    } else {
	      uni.showToast({ title: '下载失败', icon: 'none' });
	    }
	  },
	  fail: () => {
	    uni.showToast({ title: '下载失败', icon: 'none' });
	  }
	});
}
const checkRl = () =>{
	
}
const checkUrl = ()=>{
	let url = `?pages/index/index&scene=value=${value.value}`
	data.value = url
}
</script>

<style lang="scss">
	Page{
		background: #e6e6e6;
	}
	.content{
		width: 680rpx;
		margin: 40rpx auto;
		padding: 20rpx;
		box-sizing: border-box;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		align-items: center;
		background: #fff;
		border-radius: 20rpx;
	}
  .QrCode{
	  width: 400rpx;
	  height: 400rpx;
  }
  .title{
	  width: 100%;
	  text-align: center;
	  margin: 20rpx 0;
		color: #ff9b29;
  }
  .bottom{
	  width: 100%;
	  font-size: 28rpx;
	  display: flex;
	  align-items: center;
	  justify-content: space-around;
	  margin: 50rpx 0 20rpx 0;
	  color: #ff9b29;
	  .title{
		  width: 100%;
		  font-size: 30rpx;
		  text-align: center;
		  padding: 20rpx 0;
	  }
  }
</style>
